<template>
  <div class="item-swiper">
    <div class="swiper">
      <van-swipe :autoplay="3000">
        <van-swipe-item v-for="(temp,index) in banner"  :key="index">
         <van-image fit="cover" :src="temp.img"></van-image>
        </van-swipe-item>
      </van-swipe>
    </div>
  </div>
</template>

<script>
// api
import { getBanner } from "@/api/miva";
export default {
  data() {
    return {
       banner: [],
    }
  },
  async mounted() {
    await this.getBanner();
  },
  methods: {
    async getBanner() {
      const res = await getBanner();
      console.log(res);
      this.banner = res.data;
    }
  }
}
</script>

<style lang="less">
.item-swiper{
    // width: 100%;
    
    margin: 0 auto;
    position: relative;
    padding: 0 2vw 20px;
    box-sizing: border-box;
    border-bottom: 1px solid #D3D3D3;
    .swiper {
    border-radius: 20px;
    img {
      width: 100%;
    }
  }
}
</style>
